<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org">

<div th:fragment="comm">
	<script type="text/javascript" th:src="@{/plugins/vali/js/jquery-3.2.1.min.js}"></script>
	<script type="text/javascript" th:src="@{/plugins/vali/js/popper.min.js}"></script>
	<script type="text/javascript" th:src="@{/plugins/vali/js/bootstrap.min.js}"></script>
	<script type="text/javascript" th:src="@{/plugins/vali/js/main.js}"></script>
	<script type="text/javascript" th:src="@{/plugins/vali/js/plugins/pace.min.js}"></script>
	<script type="text/javascript" th:src="@{/js/penguin.js}"></script>
	<script type="text/javascript" th:src="@{/plugins/toast/jquery.toast.js}"></script>
</div>

<div th:fragment="bootstrapValidator">
	<script th:src="@{/plugins/bootstrapvalidator/js/bootstrapValidator.min.js}"></script>
	<script th:src="@{/plugins/bootstrapvalidator/js/language/zh_CN.js}"></script>
</div>

<div th:fragment="bootstrapFileinput">
<script type="text/javascript" th:src="@{/plugins/bootstrap-fileinput/js/fileinput.min.js}"></script>
<script type="text/javascript" th:src="@{/plugins/bootstrap-fileinput/js/locales/zh.js}"></script>
<script type="text/javascript" th:src="@{/plugins/bootstrap-fileinput/themes/fa/theme.js}"></script>
</div>

	<div class="clearfix" th:fragment="pageArticle(pageInfo,status)">
		<ul class="pagination no-margin float-right">
			<li th:if="${pageInfo.pages}!=0" class="page-item"><a class="page-link" href="#" th:text="'共'+ ${pageInfo.pages}+'页'"></a></li>
			<li th:if="${pageInfo.hasPreviousPage}" class="page-item"><a
				th:href="@{'?page='+${pageInfo.prePage}+'&status='+${status}}" class="page-link"> <i
					class="fa fa-angle-left"></i>&nbsp;上一页
			</a></li>
			<th:block th:each="nav : ${pageInfo.navigatepageNums}">
				<li
					th:class="${nav==pageInfo.pageNum} ? 'page-item active':'page-item'"><a
					class="page-link" th:href="@{'?page='+${nav}+'&status='+${status}}" th:text="${nav}"></a>
				</li>
			</th:block>
			<th:block th:if="${pageInfo.hasNextPage}">
				<li class="page-item"><a
					th:href="@{'?page='+${pageInfo.nextPage}+'&status='+${status}}" class="page-link">
						下一页&nbsp;<i class="fa fa-angle-right"></i>
				</a></li>
			</th:block>
		</ul>
	</div>
	
	<div class="clearfix" th:fragment="pageAdminNav(pageInfo)">
		<ul class="pagination no-margin float-right">
			<li th:if="${pageInfo.pages}!=0" class="page-item"><a class="page-link" href="#" th:text="'共'+ ${pageInfo.pages}+'页'"></a></li>
			<li th:if="${pageInfo.hasPreviousPage}" class="page-item"><a
				th:href="@{'?page='+${pageInfo.prePage}}" class="page-link"> <i
					class="fa fa-angle-left"></i>&nbsp;上一页
			</a></li>
			<th:block th:each="nav : ${pageInfo.navigatepageNums}">
				<li
					th:class="${nav==pageInfo.pageNum} ? 'page-item active':'page-item'"><a
					class="page-link" th:href="@{'?page='+${nav}}" th:text="${nav}"></a>
				</li>
			</th:block>
			<th:block th:if="${pageInfo.hasNextPage}">
				<li class="page-item"><a
					th:href="@{'?page='+${pageInfo.nextPage}}" class="page-link">
						下一页&nbsp;<i class="fa fa-angle-right"></i>
				</a></li>
			</th:block>
		</ul>
	</div>

<ol class="page-navigator" th:fragment="pageNav(pageInfo, prevText, nextText, prefix)">
    <th:block th:if="${pageInfo.hasPreviousPage}">
        <li class="prev"><a th:href="@{'/'+${prefix}+'/'+${pageInfo.prePage}}" th:text="${prevText}"></a></li>
    </th:block>
    <th:block th:each="navIndex :${ pageInfo.navigatepageNums}">
        <li th:class="${pageInfo.pageNum==navIndex}?'current':''"><a th:href="@{'/'+${prefix}+'/'+${navIndex}}"
                                                                     th:text="${navIndex}"></a></li>
    </th:block>
    <th:block th:if="${pageInfo.hasNextPage}">
        <li class="next"><a th:href="@{'/'+${prefix}+'/'+${pageInfo.nextPage}}" th:text="${nextText}"></a></li>
    </th:block>

</ol>
<div th:fragment="remove" class="modal fade" id="removeModal">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<h4 class="modal-title">提示信息</h4>
					<button type="button" class="close" data-dismiss="modal">&times;</button>
				</div>
				<div class="modal-body">您确定要删除吗？(不可逆)</div>
				<!-- 模态框底部 -->
				<div class="modal-footer">
					<button type="button" class="btn btn-outline-secondary"
						data-dismiss="modal">关闭</button>
					<button type="button" class="btn btn-outline-primary" onclick="remove()">确定</button>
				</div>

			</div>
		</div>
	</div>
<div th:fragment="recycle" class="modal fade" id="recycleModal">
		<div class="modal-dialog">
			<div class="modal-content">
				<div class="modal-header">
					<h4 class="modal-title">提示信息</h4>
					<button type="button" class="close" data-dismiss="modal">&times;</button>
				</div>
				<div class="modal-body">您确定要放入回收站吗？</div>
				<!-- 模态框底部 -->
				<div class="modal-footer">
					<input type="hidden" id="tagid" />
					<button type="button" class="btn btn-outline-secondary"
						data-dismiss="modal">关闭</button>
					<button type="button" class="btn btn-outline-primary" onclick="recycle()">确定</button>
				</div>

			</div>
		</div>
</div>

<!-- 顶部栏 -->
 <head th:fragment="head(title)">
    <title thSys:text="${title}"></title>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <link rel="shortcut icon" th:href="${#maps.containsKey(options,'ico_logo') == false ? '/static/img/favicon.ico' : options['ico_logo'] }"/>
	<link rel="stylesheet" type="text/css" th:href="@{/plugins/bootstrap/css/bootstrap.min.css}">  
    <link rel="stylesheet" type="text/css" th:href="@{/plugins/vali/css/main.css}">
    <link rel="stylesheet" type="text/css" th:href="@{/plugins/font-awesome-4.7.0/css/font-awesome.min.css}">
	<link rel="stylesheet" type="text/css" th:href="@{/plugins/toast/jquery.toast.css}">
	<link rel="stylesheet" th:href="@{/plugins/simplemde/simplemde.min.css}">
	<link rel="stylesheet" th:href="@{/plugins/simplemde/github.min.css}">
	<link rel="stylesheet" th:href="@{/plugins/bootstrap-fileinput/css/fileinput.min.css}">
	<link rel="stylesheet" th:href="@{/css/attachment.css}">
</head>
<header th:fragment="header" class="app-header"><a class="app-header__logo" href="/admin"><img src="/yiyuan/logo1.png" width="60px"></a>
     <a class="app-sidebar__toggle" href="#" data-toggle="sidebar" aria-label="Hide Sidebar"></a>
      <ul class="app-nav">
      <a class="app-nav__item" href="/" th:target="_blank"  aria-label="Show notifications"><i class="fa fa-paper-plane fa-lg"></i></a>
        <!-- <li class="dropdown"><a class="app-nav__item" href="#" data-toggle="dropdown" aria-label="Show notifications"><i class="fa fa-bell-o fa-lg"></i></a>
          <ul class="app-notification dropdown-menu dropdown-menu-right">
            <li class="app-notification__title">3条未读消息</li>
            <div class="app-notification__content">
              <li><a class="app-notification__item" href="javascript:;"><span class="app-notification__icon"><span class="fa-stack fa-lg"><i class="fa fa-circle fa-stack-2x text-primary"></i><i class="fa fa-envelope fa-stack-1x fa-inverse"></i></span></span>
                  <div>
                    <p class="app-notification__message">Lisa sent you a mail</p>
                    <p class="app-notification__meta">2 min ago</p>
                  </div></a></li>
              <div class="app-notification__content">
                <li><a class="app-notification__item" href="javascript:;"><span class="app-notification__icon"><span class="fa-stack fa-lg"><i class="fa fa-circle fa-stack-2x text-primary"></i><i class="fa fa-envelope fa-stack-1x fa-inverse"></i></span></span>
                    <div>
                      <p class="app-notification__message">Lisa sent you a mail</p>
                      <p class="app-notification__meta">2 min ago</p>
                    </div></a></li>
                <li><a class="app-notification__item" href="javascript:;"><span class="app-notification__icon"><span class="fa-stack fa-lg"><i class="fa fa-circle fa-stack-2x text-danger"></i><i class="fa fa-hdd-o fa-stack-1x fa-inverse"></i></span></span>
                    <div>
                      <p class="app-notification__message">Mail server not working</p>
                      <p class="app-notification__meta">5 min ago</p>
                    </div></a></li>
                <li><a class="app-notification__item" href="javascript:;"><span class="app-notification__icon"><span class="fa-stack fa-lg"><i class="fa fa-circle fa-stack-2x text-success"></i><i class="fa fa-money fa-stack-1x fa-inverse"></i></span></span>
                    <div>
                      <p class="app-notification__message">Transaction complete</p>
                      <p class="app-notification__meta">2 days ago</p>
                    </div></a></li>
              </div>
            </div>
            <li class="app-notification__footer"><a href="#">See all notifications.</a></li>
          </ul>
        </li> -->
        <!-- User Menu-->
        <li class="dropdown"><a class="app-nav__item" href="#" data-toggle="dropdown" aria-label="Open Profile Menu"><i class="fa fa-user fa-lg"></i></a>
          <ul class="dropdown-menu settings-menu dropdown-menu-right">
            <li><a class="dropdown-item" href="/admin/option"><i class="fa fa-cog fa-lg"></i> 设置</a></li>
            <li><a class="dropdown-item" href="/admin/profile"><i class="fa fa-user fa-lg"></i> 个人资料</a></li>
            <li><a class="dropdown-item" href="/admin/exitLogon"><i class="fa fa-sign-out fa-lg"></i> 退出</a></li>
          </ul>
        </li>
      </ul>
    </header>
<div th:fragment="sidebar">
 <!-- Navbar-->
 <!-- 侧边栏-->
    <div class="app-sidebar__overlay" data-toggle="sidebar"></div>
    <aside class="app-sidebar">
      <div class="app-sidebar__user"><img width="60px" class="app-sidebar__user-avatar" th:src="${session.user_session.userPortrait == null ? '/static/img/portrait.jpg' : session.user_session.userPortrait}" alt="User Image">
        <div>
          <p class="app-sidebar__user-name" th:text="${session.user_session.userDisplayName}" ></p>
        </div>
      </div>
      <ul class="app-menu">
        <li><a class="app-menu__item" href="/admin"><i class="app-menu__icon fa fa-dashboard"></i><span class="app-menu__label">仪表盘</span></a></li>
        <li class="treeview"><a class="app-menu__item" href="#" data-toggle="treeview"><i class="app-menu__icon fa fa-book"></i><span class="app-menu__label">页面</span><i class="treeview-indicator fa fa-angle-right"></i></a>
          <ul class="treeview-menu">
            <li><a class="treeview-item" href="/admin/article"><i class="icon fa fa-circle-o"></i>所有页面</a></li>
            <li><a class="treeview-item" href="/admin/article/new"><i class="icon fa fa-circle-o"></i>写页面</a></li>
            <li><a class="treeview-item" href="/admin/category"><i class="icon fa fa-circle-o"></i>分类目录</a></li>
            <li><a class="treeview-item" href="/admin/tag"><i class="icon fa fa-circle-o"></i>标签</a></li>
          </ul>
        </li>
        <li class="treeview"><a class="app-menu__item" href="#" data-toggle="treeview"><i class="app-menu__icon fa fa-file-text-o"></i><span class="app-menu__label">效果</span><i class="treeview-indicator fa fa-angle-right"></i></a>
          <ul class="treeview-menu">
            <li><a class="treeview-item" href="/admin/page"><i class="icon fa fa-circle-o"></i>所有效果</a></li>
            <li><a class="treeview-item" href="/admin/page/new"><i class="icon fa fa-circle-o"></i>新建效果</a></li>
          </ul>
        </li>
        <li><a class="app-menu__item" href="/admin/attachment"><i class="app-menu__icon fa fa-file-image-o"></i><span class="app-menu__label">附件</span></a></li>
<!--         <li><a class="app-menu__item" href="charts.html"><i class="app-menu__icon fa fa-comments"></i><span class="app-menu__label">评论</span></a></li> -->
        <li class="treeview"><a class="app-menu__item" href="#" data-toggle="treeview"><i class="app-menu__icon fa fa-paint-brush"></i><span class="app-menu__label">外观</span><i class="treeview-indicator fa fa-angle-right"></i></a>
          <ul class="treeview-menu">
            <li><a class="treeview-item" href="/admin/theme"><i class="icon fa fa-circle-o"></i>主题</a></li>
            <li><a class="treeview-item" href="/admin/menus"><i class="icon fa fa-circle-o"></i>菜单</a></li>
          </ul>
        </li>
        <li class="treeview"><a class="app-menu__item" href="#" data-toggle="treeview"><i class="app-menu__icon fa fa-user-circle"></i><span class="app-menu__label">用户</span><i class="treeview-indicator fa fa-angle-right"></i></a>
          <ul class="treeview-menu">
            <li><a class="treeview-item" href="/admin/profile"><i class="icon fa fa-circle-o"></i>个人资料</a></li>
           	<li><a class="treeview-item" href="/admin/links"><i class="icon fa fa-circle-o"></i>友情链接</a></li>
          </ul>
        </li>
		  <li class="treeview"><a class="app-menu__item" href="#" data-toggle="treeview"><i class="app-menu__icon fa fa-square-o"></i><span class="app-menu__label">外部接口</span><i class="treeview-indicator fa fa-angle-right"></i></a>
			  <ul class="treeview-menu">
				  <li><a class="treeview-item" href="/admin/externalDebugUser"><i class="icon fa fa-circle-o"></i>游戏相关接口</a></li>
				  <li><a class="treeview-item" href="/admin/externalDebugMes"><i class="icon fa fa-circle-o"></i>短信相关接口</a></li>
			  </ul>
		  </li>
        <li class="treeview"><a class="app-menu__item" href="#" data-toggle="treeview"><i class="app-menu__icon fa fa-cog"></i><span class="app-menu__label">设置</span><i class="treeview-indicator fa fa-angle-right"></i></a>
          <ul class="treeview-menu">
            <li><a class="treeview-item" href="/admin/option"><i class="icon fa fa-circle-o"></i>网站设置</a></li>
          </ul>
        </li>
      </ul>
    </aside>
</div>
<th:block th:if="${article.articleComment} ==0 " th:fragment="comment">
    <script th:inline="javascript" type="text/javascript">
    $(function(){
    	//获取拦截器传来的设置项
        /*<![CDATA[*/
    	var options=/*[[${options}]]*/;
        /*]]>*/
        if(options.platform_comment=="gitalk"){
        	$(".post-content").append("<div id='gitalk-container'></div>");
        	var gitalk = new Gitalk({
        		  clientID: options.comment_gitalk_clientid,
        		  clientSecret: options.comment_gitalk_clientSecret,
        		  repo: options.comment_gitalk_repo,
        		  owner: options.comment_gitalk_owner,
        		  admin: [options.comment_gitalk_admin],
        		  id: location.pathname,      // Ensure uniqueness and length less than 50
        		  distractionFreeMode: false  // Facebook-like distraction free mode
        		})
        	gitalk.render('gitalk-container')
        }else if(options.platform_comment=="valine"){
        	$(".post-content").append("<div id='vcomments'></div>");
        	new Valine({
                el: '#vcomments',
                appId: options.comment_valine_appid,
                appKey: options.comment_valine_appkey,
                notify:false, 
                verify:false, 
                placeholder: options.comment_valine_hint,
                avatar: options.comment_valine_portrait,
                //visitor: true
            })
        }
    });
    </script>
</th:block>
<th:block th:fragment="comm_comment">
<script th:inline="javascript" type="text/javascript">
    $(function(){
    	//获取拦截器传来的设置项
        /*<![CDATA[*/
    	var options=/*[[${options}]]*/;
        /*]]>*/
        if(options.platform_comment=="gitalk"){
        	$(".post-content").append("<div id='gitalk-container'></div>");
        	var gitalk = new Gitalk({
        		  clientID: options.comment_gitalk_clientid,
        		  clientSecret: options.comment_gitalk_clientSecret,
        		  repo: options.comment_gitalk_repo,
        		  owner: options.comment_gitalk_owner,
        		  admin: [options.comment_gitalk_admin],
        		  id: location.pathname,      // Ensure uniqueness and length less than 50
        		  distractionFreeMode: false  // Facebook-like distraction free mode
        		})
        	gitalk.render('gitalk-container')
        }else if(options.platform_comment=="valine"){
        	$(".post-content").append("<div id='vcomments'></div>");
        	new Valine({
                el: '#vcomments',
                appId: options.comment_valine_appid,
                appKey: options.comment_valine_appkey,
                notify:false, 
                verify:false, 
                placeholder: options.comment_valine_hint,
                avatar: options.comment_valine_portrait,
                //visitor: true
            })
        }
    });
    </script>
</th:block>
</body>
</html>